<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>新职课JAVA学习平台-前台</title>
        <link rel="stylesheet" href="public/css/front.css" />
        <link rel="stylesheet" href="public/css/front_head.css" />
        <script type="text/javascript" src="public/js/jquery-1.7.2.min.js"></script>
		<script type="text/javascript" src="public/js/highcharts.js"></script>
		<script type="text/javascript" src="public/js/index.js"></script>
		<script type="text/javascript" src="public/js/front_work.js"></script>
		
<style>
	.project:link,.project:visited{
		color:gray;
		 text-decoration:none;
	}
	
	

</style>
<script>
	$(function(){
		var data6={
		    'title':'每月/日客服数',
		    'xAxis':['株洲','上海','广州','其他'],
		    'yAxis':[{name:'人数',data:[${citytj[0]},${citytj[1]},${citytj[2]},${citytj[3]}]}]
		}

	    createCharts("a6",data6);
	});
	
/* 	$(function(){
		$("#zhuxiao").on("click", function() {
			$.messager.confirm('退出系统', '您真的要退出吗？', function(r) {
				 if (r) {
					window.location.href = "/logout";
				} 	
			}); 
		});
	})
 */	
	
</script>

<link rel="shortcut icon" type="image/x-icon"
	href=" public/images/favicon.ico" media="screen" />
    </head>
<body style="background-image: url(public/images/bg_text.png); background-repeat: no-repeat;">
    <jsp:include page="header.jsp"></jsp:include>
    <div class="welcome">
    	亲爱的『${user.name}』${user.student.gender=='男'?'帅哥':'美女' }，今天是2017年11月16日，株洲天气：<span id="weather">多云，当前气温：15度</span>。欢迎您使用新职课JAVA学习平台，祝您学习进步，成为IT界的精英^_^……
    </div>
	<div class="left">
	    <div class="one" style="background-image: url(public/images/header_blue.png);">
	    	项目管理
	    </div>
	    <br/>
	    <form method="post">
	    	<fieldset style="width: 90%;">
	    		<legend><img src="public/images/form.png"/><b style="font-size: 14px;">&nbsp;&nbsp;开发中（共${countNo}个项目）</b></legend>
	    		<ul style="margin-left: -40px;font-size: 14px;">
	    			<c:if test="${countNo==0}">
	    				<i>暂无可开发的项目</i>
	    			</c:if>
	    			
	    			<c:if test="${countNo>0}">
		    			<c:forEach  items="${leaderNo}" var="leader">
		    				
		    				<a href="front_program?id=${leader.tb_student_id }&pid=${leader.tb_project_id}" class="project">${leader.title }</a>		    				
		    				
		    		</c:forEach>
	    			</c:if>
	    		</ul>
	    	</fieldset>
	    </form>
	    <br/>
	    <form>
	    	<fieldset style="width: 90%;">
	    		<legend><img src="public/images/form.png"/><b style="font-size: 14px;">&nbsp;&nbsp;已完成项目（共${count}个项目）</b></legend>
	    		<ul class="xm">
	    		
	    			<c:if test="${count==0}">
	    				<li>
			    			<div>
			    			<i>暂无已完成的项目</i>
			    			</div>		    				
			    		</li>
	    				
	    			</c:if>
	    			
	    			<c:if test="${count>0}">
	    				<c:forEach  items="${leader}" var="leader">
			    			<li>
			    				<div>
				    				<img src="public/images/practice.png"/>
				    				<a>${leader.title}</a>
			    				</div>
			    				<div class="grade">
			    					<img src="public/images/your_score.png"/>
				    				${leader.student_name}
			    				</div>
			    			</li>
	    				</c:forEach>	
	    			</c:if>
	    		</ul>
	    	</fieldset>
	    </form>
	    <br/>
	    <div class="one" style="background-image: url(public/images/header_blue.png);">
	    	就业城市
	    </div>
	    <div id="a6" class="container"></div>
	</div>
	    
	    
	<div class="right">
	    <div class="two" style="background-image: url(public/images/header_red.png);">
	    	就业榜前三强
	    </div>
	    <div class="three" >
	    	<table border="1" style="height: 180px;border-collapse: collapse;width: 100%;margin-top: 20px;">
				<thead>
					<tr style="background: #EEE;">
				    	<th style="border: 1px #CCC solid;padding:5px; background:white;"></th>
						<th style="border: 1px #CCC solid;padding:5px; text-align:left;">部门</th>
						<th style="border: 1px #CCC solid;padding:5px;">姓名</th>
						<th style="border: 1px #CCC solid;padding:5px;">城市</th>
						<th style="border: 1px #CCC solid;padding:5px; text-align:left;">公司</th>
						<th style="border: 1px #CCC solid;padding:5px;">试用薪资</th>
						<th style="border: 1px #CCC solid;padding:5px;">正式薪资</th>
					</tr>
				</thead>
				<tbody>
				<c:forEach var="best" items="${best }" varStatus="bests">
					<tr>
				 	   	<td style="color:red; font-style:bold;"><c:if test="${bests.count==1 }">冠军</c:if>
				 	   	<c:if test="${bests.count==2 }">亚军</c:if>
				 	   	<c:if test="${bests.count==3 }">季军</c:if></td>
				  	 	<td style=" text-align:left;">${best.class_name }</td>
						<td>${best.student_name }</td>
						<td>上海</td>
						<td style=" text-align:left;">${best.company }</td>
						<td>${best.trial_salary }</td>
						<td>${best.salary }</td>
					</tr>
				</c:forEach>
					<tr>
					    <td colspan="7" style="text-align:left;">你的学习目标就是：出现在新职课JAVA的三强榜中。下一个会是你吗？</td>
					</tr>
				</tbody>
			</table>
	    </div>
	    <h4>我的练习册</h4>
	    <form>
	    	<fieldset>
	    		<legend><img src="public/images/form.png"/><b style="font-size: 14px;">&nbsp;&nbsp;可用练习（共${handjd.size()}份练习）</b></legend>
	    		<ul class="lx">
	    			<c:forEach items="${handjd}" var="jd">
		    			<li>
		    				<div>
			    				<img src="public/images/practice.png"/>
			    				<input type="hidden" value="${jd.work.id}">
			    				<a class="work" >${cla.className}-${jd.work.name }</a>
		    				</div>
		    				<div class="grade">
			    				${jd.work.endTime}
		    				</div>
		    			</li>
	    			</c:forEach>
	    			
	    		</ul>
	    	</fieldset>
	    </form>
	    <br/>
	    <form>
	    	<fieldset>
	    		<legend><img src="public/images/form.png"/><b style="font-size: 14px;">&nbsp;&nbsp;历史练习</b></legend>
	    		<ul class="lx">
	    			<c:forEach items="${Markjd}" var="mjd" begin="0" end="10" step="1">
	    				<c:choose>
	    					<c:when test="${mjd.state == '已批阅' }">
		    					<li>
				    				<div>
					    				<img src="public/images/practice.png"/>
					    				<input type="hidden" value="${mjd.work.id}">
					    				<a class="seework">${cla.className}-${mjd.work.name}</a>
				    				</div>
				    				<div class="grade">
				    					<img src="public/images/your_score.png"/>
					    				${mjd.allScore}
				    				</div>
				    			</li>
	    					</c:when>
	    					<c:when test="${mjd.state == '等待批改' }">
		    					<li>
				    				<div>
					    				<img src="public/images/practice.png"/>
					    				<span>${cla.className}-${mjd.work.name}</span>
				    				</div>
				    				<div class="grade">
				    					<img src="public/images/wait.png"/>
					    				${mjd.state}
				    				</div>
				    			</li>
	    					</c:when>
	    					<c:otherwise>
	    						<li>
				    				<div>
					    				<img src="public/images/practice.png"/>
					    				<span>${cla.className}-${mjd.work.name}</span>
				    				</div>
				    				<div class="grade">
				    					<img src="public/images/wait.png"/>
					    				${mjd.state}
				    				</div>
				    			</li>
	    					</c:otherwise>
			    		</c:choose>	
	    			</c:forEach>
	    		</ul>
	    	</fieldset>
	    </form>
	    <fieldset class="advice">
	    		<legend><img src="public/images/notice2.png"/><b style="font-size: 14px;">&nbsp;&nbsp;系统通知</b></legend>
	    		<ul class="tz">
			  		<li>
	    				<div>
		    				<img src="public/images/notice.png"/>
		    				<a>各位学员，2017年五一放假时间为4月29日、4月30日、5月1日三天。请安排好自己的行程，准时回公司复课！</a>
	    				</div>
	    				<div class="time">
		    				2017-12-12
	    				</div>
	    			</li>
					<li>
	    				<div>
		    				<img src="public/images/notice.png"/>
		    				<a>各位学员，2017年五一放假时间为4月29日、4月30日、5月1日三天。请安排好自己的行程，准时回公司复课！</a>
	    				</div>
	    				<div class="time">
		    				2017-12-12
	    				</div>
	    			</li>
			  	</ul>
		</fieldset>
	    	
	    
	    
	</div>
	<div style="height: 60px; margin-top:20px;float:left;width: 99.5%;border-top: 1px solid #CCC;">
		<div style="margin-top:10px;margin-left: 10px;">
			<img style="height: 50px;width: 200px;" src="public/images/logo-colored3.png"/>
		</div>
		<div>
			
		</div>
	</div>
	
</body>
</html>